<template>
  <div>
    <Row>
      <Col span="24">
        <topmenu></topmenu>
      </Col>
    </Row>
    <Row>
      <Col span="4" class="leftBar" >
        <leftmenu></leftmenu>
      </Col>
      <Col span='20' class="rightContent"  ref="nana">
        <router-view></router-view>
      </Col>
    </Row>
  </div>
</template>

<script>
  import leftMenu from './nav/leftMenu'
  import topMenu  from './nav/topMenu'

export default {

  data () {
    return {

    }
  },
  computed:{
    windowHeight:function(){
      return  window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
    }
  },

  mounted:function () {
    this.$nextTick(function () {
      let h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
      this.$refs.nana.style.height = h +'px';
    });

  },
  components:{
    'leftmenu':leftMenu,
    'topmenu':topMenu
  }
}
</script>
<style scoped>
.rightContent{background-color: #fff;overflow-x: hidden;overflow-y: auto;height: 705px;}
</style>
